<?php
	require_once 'common/inc/constants.inc.php';
	require_once 'common/autoLoadClass.php';
	$db = DataBase::get()->handle();

?>
<head>
<title>Comicblocks - BETA</title>
<link href='http://fonts.googleapis.com/css?family=Capriola' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Share+Tech' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="css/home/main.css" />

<script type="text/javascript" src="scripts/jquery/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="scripts/jquery/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="scripts/navigation/header-fp.js"></script>
<script type="text/javascript" src="scripts/home/signup.js"></script>
<script type="text/javascript" src="scripts/home/highlights.js"></script>

<script>
	(function($) {
		$(document).ready(function() {
			
		
		
		});
    
})(jQuery);

</script>
</head>

<body id="front-page">
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<nav id="main-nav">
		<div id="logo-container"><img id="logo-img" src="images/home/logo/logo_small_v2.png" /></div>
			<ul class="nav-links">

				<!--<li><a id="signup">Signup</a></li>
				<li><a id="login">Login</a></li>-->
				<li><a class="features-button">Features</a></li>
				<li><a class="highlights-button">Highlights</a></li>
				<li><a class="contacts-button">Contact</a></li>
				<li><a class="signup-button">Signup</a></li>
				
				
			</ul>

	</nav>

<section id="welcome">
	<nav id="welcome-nav">
		<ul class="nav-links">

			<!--<li><a id="signup">Signup</a></li>
			<li><a id="login">Login</a></li>-->
			<li><a class="features-button">Features</a></li>
			<li><a class="highlights-button">Highlights</a></li>
			<li><a class="contacts-button">Contact</a></li>
			<li><a href="login.php" class="login">Login</a></li>
			
		</ul>
	
	</nav>
	<!--
	<article id="promo">
		<p>Unleash your stories</p>
		<br />
		<p>Comicblocks. platform - marketplace - connections <br />  for independent comic authors.</p>
		<a id="beta_signup">Signup for BETA</a>
	</article>
	-->
	<div id="register-form-container">
			<img id="r-logo" width="350px" src="images/home/logo/logo_big_v4.png" />
			<div id="register-form-content">
				<h1>Share. Market. Publish </h1>
				
				<p>A free platform for independent comic authors to reach their audience. </p>
				<p id="details">Register NOW for the beta version!</p>
				<form id="register-form">
				
					<input name="email" type="email" id ="r-input" placeholder="Your email address" />
					<input type="submit" id="r-submit" value="GO" />
			
				</form>
			</div>
			
			<div id="share-form-content"> 
				<h1>Thank you for signing up for the BETA! </h1>
				<p>Stay tuned for awesome announcements! If you haven't done so already please support us on Indiegogo.com.</p>
				<p id='details'>Help us spread the word!</p> 
				<form id='share-form'> 
					<div class='fb-send' data-href='http://developers.facebook.com/docs/plugins/' data-colorscheme='dark'></div> 
					<fieldset> 
					<input id='s-input' name="email" type='email' placeholder='Friends email address' /> 
					<input id='s-submit' type='submit'  value='SHARE' /> \
					</fieldset> 
				</form> 
			</div>;
		
		</div>
</section> 

<section id="features">
	<span id="triangle">
	</span>
	<div id="features-container">
		<div class="feature">
			<div>
				<img src="images/home/welcome/connect.png" />
				<p>Connect and collabrate with writers and artist around the world.</p>
				
			</div>
			
		</div>
		<div class="feature">
			<div>
				<img src="images/home/welcome/market.png" />
				<p>Market your comics with author's block and gather subscribers.</p>
			</div>
			
		</div>
		<div class="feature">
			<div>
				<img src="images/home/welcome/rocket.png" />
				<p>Share your comics and launch your career.</p>
			</div>
			
		</div>
		
	</div>
</section>
<!--
<section id="authorpagepromo">
	<article>
		<p class="feature-header">Introducing author's block.</p>
		<p>A beautiful, simple and customizable page</p>
	</article>
</section>
-->
<section id="highlights">
	<ul id="slider-wrapper">
		<li class="slide" id="authorpagepromo">
			<article>
			<p class="feature-header">Publish your work instantly over multiple devices.</p>
			<p>Maecenas leo dolor, pharetra quis consectetur ac, luctus et dui. Donec iaculis rutrum feugiat. Sed id magna est. Cras eu dignissim dolor. Donec diam lectus, ullamcorper sit amet tempor congue, ultricies in libero. Donec fermentum eleifend est, id pharetra libero.</p>
			</article>
		</li>
		<li class="slide" id="devicespromo">
			<article>
			<p class="feature-header">Publish your work instantly over multiple devices.</p>
			<p>Maecenas leo dolor, pharetra quis consectetur ac, luctus et dui. Donec iaculis rutrum feugiat. Sed id magna est. Cras eu dignissim dolor. Donec diam lectus, ullamcorper sit amet tempor congue, ultricies in libero. Donec fermentum eleifend est, id pharetra libero.</p>	
			</article>
		</li>
		<li class="slide" id="connectionspromo">
			<article>
			<p class="feature-header">Publish your work instantly over multiple devices.</p>
			<p>Maecenas leo dolor, pharetra quis consectetur ac, luctus et dui. Donec iaculis rutrum feugiat. Sed id magna est. Cras eu dignissim dolor. Donec diam lectus, ullamcorper sit amet tempor congue, ultricies in libero. Donec fermentum eleifend est, id pharetra libero.</p>
			</article>
		</li>
	</ul>
	<div id="loader-container">
		<div id="loading-bar">
			<div id="progress"></div>
		</div>
		<div id="index-container">
			<ul id="index-list">
				<li class="non-active"></li>
				<li class="non-active"></li>
				<li class="non-active"></li>
				
			</ul>
		</div>
	</div>
</section>
<section id="contactarea">
	<article>
	
		<div id="contact-h-container"><p id="contact-h">Get in thouch. We'd love to hear from you!</p></div>
		<form id="contact">
			
			<fieldset>
			<label>Name:</label>
			<input name="name" type="text" />
			</fieldset>
			<fieldset>
			<label>Email:</label>
			<input name="email" type="text" />
			</fieldset>
			<fieldset>
			<label>Message:</label>
			<textarea name="message">
			</textarea>
			</fieldset>
			<fieldset>
			<input id="c-submit" type="submit" value ="SEND" />
			</fieldset>
		</form>
	</article>
</section>
<footer id="main_footer">
</footer>

<script>
	$(function() {
		$main_nav = $('#main-nav');
		$main_nav.header_fp();
		$featured_button = $('.features-button');
		$featured_button.scrollTo($('#features'));
		$contact_button = $('.contacts-button');
		$contact_button.scrollTo($('#contactarea'));
		$highlights_button = $('.highlights-button');
		$highlights_button.scrollTo($('#highlights'));
		$signup_button = $('.signup-button');
		$signup_button.scrollTo($('#welcome'));
		
		$highlights =  $('#highlights');
		$highlights.hslideShow();
	
	});
</script>
<script>
	$(function() {
		$signup = $('#register-form-container');
		$signup.sharing();
		
	
	});
</script>

</body>